<template>
	<view class="main_body">
		<view class="body_top" style="width: 750rpx; height: 190rpx;display: flex;align-items: flex-end;">
			<view class="" style="display: flex;align-items: center;width: 100%;">
				<u-tabs :list="list" class="tap_t" activeStyle="color:#fff" inactiveStyle="color:#fff" lineColor="#fff">
				</u-tabs>
				<view class="aj_between" style="flex: 2;padding: 20rpx 26rpx;">
					<view class="seach_on">
						搜索商品
					</view>
					<view class="top_right" @tap="goCart">
						<image style="width: 18px;height: 18px;" src="/static/img/newimg/index/shoppingCart5.png"
							mode=""></image>
						<view style="font-size: 22rpx;color: #fff;zoom: 0.8;">
							购物车
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="swiper_x">
			<u-swiper radius="0" duration="600" imgMode="scaleToFill" circular height="323" :list="icons" @change=""
				@click=""></u-swiper>
		</view>
		<view style="height: 190rpx;width: 100vw;">

		</view>
		<view style="height: 100%;margin-top:190rpx;left: 0;right: 0;top: 0;bottom: 0;">
			<view class="">

				<view style="display: none;" class="">
					<view class="center_letter">
						<view class="center_card">
							<image src="/static/img/index/stadiumBg.png" style="width: 100%;" mode="widthFix"></image>
							<view class="center_card_body">
								<p class="tap_t" style="font-size: 32rpx!important;">华天贝优选.华天贝馆</p>
								<view class="aj_between" style="margin-top:30rpx;">
									<view class="model_text">
										<image class="model_text_img"
											src="/static/img/httpindex/mcaLeK7McvVI4mmsnXHu1249.png" mode="widthFix">
										</image>
										<text style="font-size: 26rpx;font-weight: 600;">三门馆</text>
									</view>
									<view class="model_text">
										<image class="model_text_img"
											src="/static/img/httpindex/Iz8UP8Ys3diFjtmJZUK01269.png" mode="widthFix">
										</image>
										<text style="font-size: 26rpx;font-weight: 600;">青田馆</text>
									</view>
									<view class="model_text">
										<image class="model_text_img"
											src="/static/img/httpindex/mcaLeK7McvVI4mmsnXHu1249.png" mode="widthFix">
										</image>
										<text style="font-size: 26rpx;font-weight: 600;">三门馆</text>
									</view>
								</view>
							</view>
						</view>
					</view>
					<view style="padding:14rpx;">
						<view style="margin-top: 20rpx;display: flex;align-items: center;">
							<image src="/static/img/newimg/index/isCollect.png" style="width: 20px;margin-right: 8rpx;"
								mode="widthFix"></image>
							<view class="main_text">华天贝馆<view class="radius_text"></view>一县一馆</view>
						</view>
					</view>
					<view class="content_main">
						<view class="content_card">
							<image style="width: 190rpx;border-radius: 10rpx;margin-right: 18rpx;"
								src="/static/img/httpindex/Iz8UP8Ys3diFjtmJZUK01269.png" mode="widthFix"></image>
							<view class="">
								<p class="content_title">三门馆</p>
								<view style="display: flex;align-items: center;    zoom: 0.8;">
									<view class="score_xing">
										<image style="width: 18rpx;" src="/static/img/newimg/index/collect1.png"
											mode="widthFix"></image>
										<image style="width: 18rpx;" src="/static/img/newimg/index/collect1.png"
											mode="widthFix"></image>
										<image style="width: 18rpx;" src="/static/img/newimg/index/collect1.png"
											mode="widthFix"></image>
										<image style="width: 18rpx;" src="/static/img/newimg/index/collect1.png"
											mode="widthFix"></image>
										<image style="width: 18rpx;" src="/static/img/newimg/index/collect1.png"
											mode="widthFix"></image>
									</view>
									<view class="score_num">
										5.0
									</view>
								</view>
								<view class="address_text">
									浙江省杭州市余杭区现代优杭州市余杭
								</view>
								<view class="tiip_text">
									<view>好评如潮</view>
									<view>|</view>
									<view>最喜爱店铺</view>
									<view>|</view>
									<view>服务好</view>
								</view>
								<view class="browerd">
									5.66w人近期浏览过
								</view>
							</view>
						</view>
					</view>
					<view class="content_main">
						<view class="content_card">
							<image style="width: 190rpx;border-radius: 10rpx;margin-right: 18rpx;"
								src="/static/img/httpindex/Iz8UP8Ys3diFjtmJZUK01269.png" mode="widthFix"></image>
							<view class="">
								<p class="content_title">三门馆</p>
								<view style="display: flex;align-items: center;    zoom: 0.8;">
									<view class="score_xing">
										<image style="width: 18rpx;" src="/static/img/newimg/index/collect1.png"
											mode="widthFix"></image>
										<image style="width: 18rpx;" src="/static/img/newimg/index/collect1.png"
											mode="widthFix"></image>
										<image style="width: 18rpx;" src="/static/img/newimg/index/collect1.png"
											mode="widthFix"></image>
										<image style="width: 18rpx;" src="/static/img/newimg/index/collect1.png"
											mode="widthFix"></image>
										<image style="width: 18rpx;" src="/static/img/newimg/index/collect1.png"
											mode="widthFix"></image>
									</view>
									<view class="score_num">
										5.0
									</view>
								</view>
								<view class="address_text">
									浙江省杭州市余杭区现代优杭州市余杭
								</view>
								<view class="tiip_text">
									<view>好评如潮</view>
									<view>|</view>
									<view>最喜爱店铺</view>
									<view>|</view>
									<view>服务好</view>
								</view>
								<view class="browerd">
									5.66w人近期浏览过
								</view>
							</view>
						</view>
					</view>
				</view>
				<view class="center_letter" style="flex-direction: column;justify-content: start;">
					<u-notice-bar mode="link"
						style="margin-top: 10rpx;flex:unset;width: 100%;zoom:.8;padding: 10rpx 14rpx;box-sizing: border-box;"
						color="#fff" speed="60" bgColor="rgba(95, 99, 104,.2)" :text="news">
					</u-notice-bar>
					<!-- <view class="center_card"
						style="margin-top: 0;margin-top: 54rpx;display: flex;justify-content: space-around;">
						<view style="display: flex;flex-direction: column;align-items: center;">
							<image style="width: 80rpx;" src="/static/img/newimg/index/function1.png" mode="widthFix">
							</image>
							<view style="color: #fff;font-size: 26rpx;font-weight: 600;margin-top: 2rpx;">每日任务</view>
						</view>
						<view style="display: flex;flex-direction: column;align-items: center;">
							<image style="width: 80rpx;" src="/static/img/newimg/index/function1.png" mode="widthFix">
							</image>
							<view style="color: #fff;font-size: 26rpx;font-weight: 600;margin-top: 2rpx;">付款码</view>
						</view>
						<view style="display: flex;flex-direction: column;align-items: center;">
							<image style="width: 80rpx;" src="/static/img/newimg/index/function1.png" mode="widthFix">
							</image>
							<view style="color: #fff;font-size: 26rpx;font-weight: 600;margin-top: 2rpx;">卡管理</view>
						</view>
					</view> -->
				</view>

				<view style="background: #f7f7f7;position: relative;padding: 20rpx;display:none">
					<view style="background: #f7f7f7;" class="top_tab">

						<view class="top_tab_card" @tap="goChats();">
							<image style="width: 80rpx;" src="@/static/img/httpindex/zaixianliaotian.png"
								mode="widthFix">
							</image>
							<view style="font-size: 24rpx;color:#000;margin-top: 4rpx;">
								在线聊天
							</view>
						</view>
						<view class="top_tab_card" @tap="noOpen()">
							<image style="width: 80rpx;" src="@/static/img/httpindex/dianpu.png" mode="widthFix">
							</image>
							<view style="font-size: 24rpx;color:#000;margin-top: 4rpx;">
								店铺
							</view>
						</view>

						<view class="top_tab_card" @tap="noOpen">
							<image style="width: 80rpx;" src="@/static/img/httpindex/tejia.png" mode="widthFix">
							</image>
							<view style="font-size: 24rpx;color:#000;margin-top: 4rpx;">特价</view>
						</view>

						<view class="top_tab_card" @tap="goArticles('news')">
							<image style="width: 80rpx;" src="@/static/img/httpindex/liucheng.png" mode="widthFix">
							</image>
							<view style="font-size: 24rpx;color:#000;margin-top: 4rpx;">流程</view>
						</view>

						<view class="top_tab_card" @tap="noOpen">
							<image style="width: 80rpx;" src="@/static/img/httpindex/zhibo.png" mode="widthFix">
							</image>
							<view style="font-size: 24rpx;color:#000;margin-top: 4rpx;">直播</view>
						</view>

						<view class="top_tab_card" @tap="noOpen">
							<image style="width: 80rpx;" src="@/static/img/httpindex/baiyelianmeng.png" mode="widthFix">
							</image>
							<view style="font-size: 24rpx;color:#000;margin-top: 4rpx;">百业联盟</view>
						</view>

						<view class="top_tab_card" @tap="goArticles('course')">
							<image style="width: 80rpx;" src="@/static/img/httpindex/shipin.png" mode="widthFix">
							</image>
							<view style="font-size: 24rpx;color:#000;margin-top: 4rpx;">健康频道</view>
						</view>

						<view class="top_tab_card" @tap="noOpen">
							<image style="width: 80rpx;" src="@/static/img/httpindex/shenghuojiaofei.png"
								mode="widthFix">
							</image>
							<view style="font-size: 24rpx;color:#000;margin-top: 4rpx;">生活缴费</view>
						</view>

					</view>
					<!-- 华天贝馆
					<view style="width: 100%;position: relative;margin-top: 20rpx;">
					<image src="/static/img/index/stadiumBg.png" style="width: 100%;" mode="widthFix"></image>
					<view class="center_card_body">
						<p class="tap_t" style="font-size: rpx!important;">华天贝优选.华天贝馆</p>
						<view class="aj_between" style="margin-top:30rpx;">
							<view class="model_text">
								<image class="model_text_img" src="/static/img/httpindex/mcaLeK7McvVI4mmsnXHu1249.png"
									mode="widthFix">
								</image>
								<text style="font-size: 26rpx;font-weight: 600;">三门馆</text>
							</view>
							<view class="model_text">
								<image class="model_text_img" src="/static/img/httpindex/Iz8UP8Ys3diFjtmJZUK01269.png"
									mode="widthFix">
								</image>
								<text style="font-size: 26rpx;font-weight: 600;">青田馆</text>
							</view>
							<view class="model_text">
								<image class="model_text_img" src="/static/img/httpindex/mcaLeK7McvVI4mmsnXHu1249.png"
									mode="widthFix">
								</image>
								<text style="font-size: 26rpx;font-weight: 600;">三门馆</text>
							</view>
						</view>
					</view>
				</view>
					
					<view class="yanxuan_card">
						<view class="country_content">
							<view class="country_title">
								<image style="width: 140rpx;margin-right: 8rpx;" src="/static/img/newimg/index/hot1.png"
									mode="widthFix"></image>
								<text style="font-size: 26rpx;color: #888;">乡村振兴，科技助农</text>
							</view> -->
					<!-- <view style="font-size: 24rpx;color: #999;zoom: .85;">
								更多>
							</view> -->
					<!-- </view> -->
					<!-- <view class="country_flex_ma"
							style="display: flex;align-items: center;justify-content: space-between;margin-top: 22rpx;">
							<view class="country_card" v-for="(fitem,findex) in lists1" :key="findex"
								@tap="goDetail(fitem.id);">
								<image style="width: 100%;" :src="fitem.cover_ico" mode="widthFix">
								</image>
								<view class="country_card_title">
									{{fitem.goods_name}}
								</view>
								<view class="country_card_price" style="margin-top: 10rpx;">
									<text style="font-size: 22rpx;color: #999;zoom: .85;">价格</text>
									<text style="font-size: 24rpx;color: #cf333b;">￥</text>
									<text class="country_card_price_text">{{fitem.member_price}}</text>
								</view>
								<view class="country_card_pay">
									<image style="width:34rpx;height: 30rpx;margin-right: 12rpx;"
										src="@/static/img/index/little_carw.png"></image>
									<view class="">
										立即购买
									</view>
								</view>
							</view>

						</view>
					</view> -->
					<!-- 华天贝严选 -->

				</view>
				<u-sticky style="height: 76rpx;line-height: 76rpx;background: #f7f7f7;top: -1px;padding: 0 10px;">

					<u-tabs @click="switchTabs" activeStyle="color:#ee2f19" inactiveStyle="color:#949494"
						itemStyle="font-size: 28rpx;display:flex:align-item:center" lineHeight="0" :list="cates">
					</u-tabs>
				</u-sticky>

				<!-- <view style="background: #f7f7f7;position: relative;top:-4rpx;padding: 4rpx 20rpx;">
					<view
						style="background: #fff;display: flex;padding: 30rpx;align-items: center;border-radius: 12rpx;margin-bottom: 16rpx;"
						class="top_tab" v-for="(ssitem,ssindex) in shops" :key="ssindex" @tap="goDetail(ssitem.id);">
						<view style="flex:1">
							<image style="width:100%;display: block;border-radius: 10rpx;height:95px"
								:src="ssitem.cover_ico" mode="scaleToFill"></image> -->

				<view class="cate_goods">
					<view
						style="background: #fff;display: flex;padding: 30rpx;align-items: center;border-radius: 12rpx;margin-bottom: 16rpx;"
						class="top_tab" v-for="(ssitem,ssindex) in shops" :key="ssindex" @tap="goDetail(ssitem.id);">
						<view style="flex:1">
							<!-- 建议图片是固定宽高 -->
							<image style="width:210rpx;height:200rpx;border-radius: 10rpx;" :src="ssitem.cover_ico"
								mode=""></image>
						</view>
						<view style="flex:2;margin-left: 20rpx;">
							<view class="list_text">
								{{ssitem.goods_name}}
							</view>
							<view style="margin-top: 20rpx;">
								<text style="font-size: 22rpx;color: #999;zoom: .85;">价格</text>
								<text style="font-size: 24rpx;color: #cf333b;"></text>
								<text class="country_card_price_text"
									style="font-size: 22rpx;color:#b62032 ;">{{ssitem.member_price}}</text>
							</view>
							<view style="position: relative;margin-top: 12rpx;">
								<image style="width: 100%;transform: scale(.8);position: relative;left: -40rpx;"
									src="/static/img/newimg/index/bayBg.png" mode="widthFix">
								</image>
								<view
									style="font-size: 24rpx;zoom:.8;color: #b62032;position: absolute;left: 16rpx;top:48%;transform: translateY(-50%);">
									已售出<text style="color: #cf333b;">{{ssitem.sell_num}}</text>件
								</view>
							</view>
						</view>
					</view>

					<uni-load-more :status="loadingType"></uni-load-more>

				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import TextRoll from '@/components/text-roll/text-roll.vue';
	import {
		mapMutations
	} from 'vuex'
	export default {
		data() {
			return {
				style: 'shanhai',
				list: [{
						name: '商城',
					},
					{
						name: '',
					},
				],

				icons: [],
				news: '',

				cates: [],
				catesList: [],

				lists1: [],
				lists2: [],

				currentIndex: 0,
				shops: [],
				page: 1,
				totalCount: 0,
				loadingType: 'more',
			}
		},

		components: {
			TextRoll
		},

		onLoad() {
			//获取软件最新版本
			// #ifdef APP-PLUS
			this.getNewVersion();

			this.timer = setInterval(() => {
				this.getNewVersion();
			}, 60000)
			// #endif

			this.getSlides();
			this.getCates();
			// this.getSelected();
		},

		onReachBottom() {
			this.getShops(this.currentIndex)
		},

		methods: {
			// 二楼bannar图接口
			async getSlides() {
				let res = await this.$myRequest({
					url: '/slides'
				})
				// console.log(res.data.data)
				let data = res.data.data;
				data.slideList.forEach(item =>
					// console.log(item),
					this.icons.push(item.icon),
				)

				this.news = res.data.data.documentInfo.title

			},
			// 四楼分类图接口
			async getCates() {
				let res = await this.$myRequest({
					url: '/getCates',

				})

				// console.log(res)
				res.data.data.map((item, index) => {
					item.name = item.title;
					// console.log(index)
					// console.log(item)
					this.catesList[index] = item
					// this.cates[index] = {
					// 	name: item.name
					// }
					this.cates.push({
						name: item.name
					})
					// console.log(this.cates)
				})

				// console.log(this.cates)
				// console.log(this.catesList)
				
				this.getShops(0);
			},
			// 五楼列表图接口
			async getSelected() {
				let res = await this.$myRequest({
					url: '/selectedAndFarm',
				})

				// console.log(res)
				this.lists1 = res.data.data.lists1
				this.lists2 = res.data.data.lists2

			},

			switchTabs(e) {
				this.page = 1;
				this.totalCount = 0;
				this.shops = [];

				let index = e.index;
				this.currentIndex = index;
				this.getShops(index)
			},

			async getShops(index) {
				let dataObj = {};
				// if (index == 0) {
				// 	dataObj = {
				// 		field: 'recom',
				// 		page: this.page,
				// 	}
				// } else {
				let item = this.catesList[index];
				// console.log(item)
				dataObj = {
					field: 'cateid_' + item.id,
					page: this.page,
				}
				// }

				let res = await this.$myRequest({
					url: '/getShopsByField',
					data: dataObj
				})

				// console.log(res)

				let ndata = res.data.data.list
				let totalCount = res.data.data.totalCount

				if (this.page === 1) {
					this.shops = ndata
					if (totalCount > ndata.length) {
						this.page = this.page + 1
					}
				} else {
					if (ndata.length > 0) {
						this.shops = [...this.shops, ...ndata];
						this.page = this.page + 1;
					}
				}

				this.loadingType = this.shops.length < this.totalCount ? 'more' : 'nomore'

			},


			goSpecial(field, title) {
				uni.navigateTo({
					url: '/pages/index/ming-qi?field=' + field + '&title=' + title
				})
			},

			hmSearch() {
				uni.navigateTo({
					url: './HM-search'
				})
			},

			goCart() {
				uni.switchTab({
					url: '/pages/cart/cart'
				})
			},

			noOpen() {
				this.$api.msg('正在开发中...')
				return false;
			},

			goArticles(name) {
				uni.navigateTo({
					url: "/pages/docs/articles?name=" + name
				})
			},

			//商品详情
			goDetail(id) {
				uni.navigateTo({
					url: '/pages/detail/detail?id=' + id
				})
			},

			goSign() {
				uni.navigateTo({
					url: '/pages/user/signin'
				})
			},

			goChats() {
				uni.navigateTo({
					url: '/pages/chat/index'
				})
			},

			async getNewVersion() {
				let current_verson = this.$version;
				let res = await this.$myRequest({
					url: '/configs',
					data: {
						name: 'VERSION'
					}
				})

				if (current_verson != res.data.data) {

					// this.$api.msg('有新的版本，正在更新，预计需1分钟，请耐心等待！', 'none', 1500)
					switch (uni.getSystemInfoSync().platform) {
						case 'android':
							this.showLoading = true;
							let url = this.$api.downLoadUrl;
							uni.downloadFile({
								url, //文件链接
								success: (data) => {
									if (data.statusCode === 200) {
										this.$api.msg('正在下载中...', 'success')
										//文件保存到本地
										uni.saveFile({
											tempFilePath: data
												.tempFilePath, //临时路径
											success: (res) => {
												this.$api.msg('软件已下载',
													'success')
												this.showLoading = false
												setTimeout(() => {
													//打开文档查看
													uni.openDocument({
														filePath: res
															.savedFilePath,
														success: (
															res
														) => {
															// console.log('打开文档成功');
														}
													});
												}, 1500)
											}
										});
									}
								},
								fail: (err) => {
									this.$api.msg('失败请重新下载')
								},
							})
							break;
						case 'ios':
							this.$refs.alertDialogIos.open()
							break;
						default:
							console.log('运行在开发者工具上')
							break;
					}

				}
			},
		}
	}
</script>

<style lang="scss">
	.main_body {
		background-color: #f7f7f7;
	}

	.body_top {
		position: absolute;
		top: 0;
		width: 100vw;
		z-index: 3;
	}

	.tap_t {
		color: #fff !important;
		font-size: 34rpx !important;
		font-weight: 600;
		flex: 1;
	}

	.seach_on {
		border-radius: 200rpx;
		background: #efefef;
		padding: 12rpx 34rpx;
		width: 280rpx;
		font-size: 26rpx;
		color: #999;
	}

	.aj_between {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.swiper_x {
		position: fixed;
		top: 0;
		width: 100vw;
	}

	.top_right {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
	}

	.center_letter {
		height: 122px;
		width: 100vw;
		display: flex;
		align-items: center;
		justify-content: center;

	}

	.center_card {
		width: 94%;
		margin-top: 80rpx;
		position: relative;
	}

	.center_card_body {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		padding: 0 18rpx;
		width: 100%;
		box-sizing: border-box;
	}

	.model_text {
		width: 31%;
		text-align: center;
	}

	.model_text_img {
		width: 100%;
		border-radius: 16rpx;
		margin-bottom: 18rpx;
	}

	.main_text {
		font-size: 30rpx;
		color: #000;
		font-weight: 600;
		display: flex;
		align-items: center;
	}

	.ra {
		width: 6px;
		height: 6px;
		background: #000;
		border-radius: 50%;
		margin: 0 6rpx;
	}

	.content_main {
		margin: 0 14rpx;
		background-color: #fff;
		padding: 0 24rpx;
		box-sizing: border-box;
		border-radius: 6rpx;
	}

	.content_title {
		font-weight: 600;
		font-size: 28rpx;
		color: #000;
	}

	.score_num {
		color: #fa6f66;
		font-size: 28rpx;
		font-weight: 600;
	}

	.score_xing {
		margin-top: 4rpx;
		background: #fa6b6e;
		display: flex;
		justify-content: space-around;
		padding: 6rpx 4rpx;
		border-radius: 6rpx;
		width: 130rpx;
		margin-right: 8rpx;
	}

	.address_text {
		width: 330rpx;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
		font-size: 24rpx;
		color: #999;
		zoom: 0.85;
		margin-top: 16rpx;
	}

	.tiip_text {
		border: 1px solid #999;
		color: #999;
		font-size: 24rpx;
		display: flex;
		border-radius: 6rpx;
		width: fit-content;
		zoom: 0.9;
		margin-top: 10rpx;
	}

	.tiip_text view {
		padding: 4rpx 8rpx;
		zoom: 0.9;
	}

	.browerd {
		margin-top: 10rpx;
		font-size: 24rpx;
		color: #d26634;
		background: #fde9e8;
		padding: 6rpx 10rpx;
		width: fit-content;
		border-radius: 6rpx;
		zoom: 0.86;
	}

	.content_card {
		display: flex;
		align-items: center;
		padding: 24rpx 0;
		border-bottom: 1px solid #ededed;
	}

	.top_tab {
		background: #f7f7f7;
		display: flex;
		flex-wrap: wrap;
	}

	.top_tab_card {
		width: 25%;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		margin-bottom: 26rpx;
	}

	.country_content {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.yanxuan_card {
		width: 100%;
		position: relative;
		margin-top: 20rpx;
		background: #fff;
		border-radius: 12rpx;
		padding: 22rpx 28rpx;
		box-sizing: border-box;

	}

	.country_title {
		display: flex;
		align-items: flex-end;

	}

	.country_card {
		width: 31%;
		display: flex;
		flex-direction: column;
		align-items: center;

	}

	.country_card_pay {
		color: #fff;
		font-size: 24rpx;
		background: linear-gradient(to right, #e4495b, #c32436);
		width: 100%;
		padding: 10rpx 0;
		display: flex;
		align-items: center;
		border-radius: 100rpx;
		justify-content: center;
		zoom: 0.83;
		margin-top: 10rpx;

	}

	.country_card_price {
		overflow: hidden; // 溢出隐藏
		white-space: nowrap; // 强制一行
		text-overflow: ellipsis; // 文字溢出显示省略号
	}

	.country_card_price_text {
		font-size: 30rpx;
		color: #cf333b;
		font-weight: 800;
		margin-right: 4rpx;
	}

	.country_card_title {
		font-size: 26rpx;
		font-weight: 600;
		width: 100%;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
		margin-top: 10rpx;
	}

	.yanxuan_num {
		color: #fff;
		font-size: 24rpx;
		zoom: 0.7;
		position: absolute;
		left: 14rpx;
		bottom: 22rpx;
	}

	.yanxuan_pay {
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 10rpx 0;
		font-size: 24rpx;
		font-weight: 600;
		color: #f94d4d;
		border-top: 1px dashed #e0e0e0;
		width: 100%;
	}

	.list_text {
		width: 100%;
		font-size: 26rpx;
		font-weight: 600;
		display: flex;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		/* 设置行数 */
		-webkit-box-orient: vertical;
	}

	// .country_flex_ma .country_card:nth-child(3n-1) {
	// 	margin-right: calc(31% + 7%/2);
	// }

	.cate_goods {
		background: #f7f7f7;
		position: relative;
		top: -4rpx;
		padding: 4rpx 20rpx 100rpx;
		overflow-y: auto;
	}
</style>